import React, { memo } from "react";
import { MenuFoldOutlined, MenuUnfoldOutlined } from "@ant-design/icons";
import { Button } from "antd";
import { HeaderContainer } from "./style";
import { useCollapse } from "@/views/context/CollapseContext";
const Header = memo(() => {
  const { collapsed, setCollapsed } = useCollapse();
  return (
    <HeaderContainer>
      <Button
        type="text"
        icon={collapsed ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
        onClick={() => setCollapsed(!collapsed)}
        className="header-button"
      />
    </HeaderContainer>
  );
});

export default Header;
